<template>
	<view>
		<NavBar text='全部患者' background='#fff' colors='#000' color='#000' :isTrue='false' />

		<view style="background-color: #fff; position: fixed; top: 58px; width: 100%; z-index: 99;">
			<view style="width: 90%; margin:0 auto;">
				<u-search placeholder="搜索患者姓名" v-model="keyword" :showAction='false'></u-search>
			</view>
			<view>
				<view class="flx shanxuan" style="width: 90%; margin:0 auto; margin-top: 30rpx;">
					<view class="flx1 shanxuan_">
						<view class="shanxuan_text">地区筛选</view>
						<view class="flxAlign" style="margin-top:10rpx; margin-left: 5rpx">
							<view class="flxAlign">
								<u-icon name="arrow-down" size="28rpx"></u-icon>
							</view>
						</view>
					</view>
					<view class="flx1 shanxuan_">
						<view class="shanxuan_text">疾病筛选</view>
						<view class="flxAlign" style="margin-top:10rpx; margin-left: 5rpx">
							<view class="flxAlign">
								<u-icon name="arrow-down" size="28rpx"></u-icon>
							</view>
						</view>
					</view>
					<view class="flx1 shanxuan_">
						<view class="shanxuan_text">更多</view>
						<view class="flxAlign" style="margin-top:10rpx; margin-left: 5rpx;">
							<view class="flxAlign">
								<u-icon name="arrow-down" size="28rpx"></u-icon>
							</view>
						</view>

					</view>
				</view>
			</view>
			<view style="width: 100%; height: 20rpx;"></view>
		</view>
		<view style="width: 100%; height: 145px;"></view>
		<view>
			<view
				style="background-color: #fff;padding-top: 10px; width: 97%; margin:0 auto; border-radius: 30rpx; margin-top:30rpx;">
				<view style="display: flex;">
					<view
						style="margin-left: 15px;margin-top: 15px;margin-bottom: 10px; width: 58px;height: 59px; background-color: #a5a5a5; border-radius: 50%;">
					</view>
					<view style="display: flex;flex-direction: column;justify-content: center; margin-left: 10px;">
						<view style="width: 95%; display: flex;justify-content: space-between;">
							<view class="flx1" style="width:150px;">
								<h4>张三三</h4>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">女</span>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">|</span>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">32岁</span>
							</view>
							<view style="margin-left: 50px;font-size: 12px; color:#a5a5a5; width: 100px;">
								2020-03-03
							</view>
						</view>

						<view style="margin-top: 10px;">
							<span
								style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px;">高血压</span>
							<span
								style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px; margin-left: 20rpx;">哮喘</span>
							<!-- <span style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px;">高血压</span> -->
							<!-- <span style="font-size: 12px;color: #0066ff;">哮喘</span> -->
						</view>
					</view>
				</view>

				<view style="font-size: 14px;color: #b7b7b7; text-align: end; width: 88%; ">
					<span style="color: red;">待续方</span>
					<view style="width: 100%; height: 10px;"></view>
				</view>
				<view class="flx" style="border-top: #f2f2f2 solid 4rpx;">
					<view class="styletext" @click="yyjy(0,{name:'张三三', age:'32', sex:'女'})">就诊记录</view>
					<view class="styletext" @click="yyjy(1)">电子处方</view>
					<view class="styletext" @click="yyjy(2)">联系患者</view>
				</view>
			</view>
			<view
				style="background-color: #fff;padding-top: 10px; width: 97%; margin:0 auto; border-radius: 30rpx; margin-top:30rpx;">
				<view style="display: flex;">
					<view
						style="margin-left: 15px;margin-top: 15px;margin-bottom: 10px; width: 58px;height: 59px; background-color: #a5a5a5; border-radius: 50%;">
					</view>
					<view style="display: flex;flex-direction: column;justify-content: center; margin-left: 10px;">
						<view style="width: 95%; display: flex;justify-content: space-between;">
							<view class="flx1" style="width:150px;">
								<h4>李小龙</h4>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">男</span>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">|</span>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">30岁</span>
							</view>
							<view style="margin-left: 50px;font-size: 12px; color:#a5a5a5; width: 100px;">
								2022-12-02
							</view>
						</view>

						<view style="margin-top: 10px;">
							<!-- <span style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px;">高血压</span> -->
							<span
								style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px; margin-left: 20rpx;">哮喘</span>
							<!-- <span style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px;">高血压</span> -->
							<!-- <span style="font-size: 12px;color: #0066ff;">哮喘</span> -->
						</view>
					</view>
				</view>

				<view style="font-size: 14px;color: #b7b7b7; text-align: end; width: 88%; ">
					<!-- <span style="color: red;">待续方</span> -->
					<view style="width: 100%; height: 10px;"></view>
				</view>
				<view class="flx" style="border-top: #f2f2f2 solid 4rpx;">
					<view class="styletext" @click="yyjy(0)">就诊记录</view>
					<view class="styletext" @click="yyjy(1)">电子处方</view>
					<view class="styletext" @click="yyjy(2)">联系患者</view>
				</view>
			</view>
			<view
				style="background-color: #fff;padding-top: 10px; width: 97%; margin:0 auto; border-radius: 30rpx; margin-top:30rpx;">
				<view style="display: flex;">
					<view
						style="margin-left: 15px;margin-top: 15px;margin-bottom: 10px; width: 58px;height: 59px; background-color: #a5a5a5; border-radius: 50%;">
					</view>
					<view style="display: flex;flex-direction: column;justify-content: center; margin-left: 10px;">
						<view style="width: 95%; display: flex;justify-content: space-between;">
							<view class="flx1" style="width:150px;">
								<h4>王大陆</h4>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">男</span>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">|</span>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">32岁</span>
							</view>
							<view style="margin-left: 50px;font-size: 12px; color:#a5a5a5; width: 100px;">
								2021-05-01
							</view>
						</view>

						<view style="margin-top: 10px;">
							<span
								style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px;">头疼</span>
							<span
								style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px; margin-left: 20rpx;">牙疼</span>
							<!-- <span style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px;">高血压</span> -->
							<!-- <span style="font-size: 12px;color: #0066ff;">哮喘</span> -->
						</view>
					</view>
				</view>

				<view style="font-size: 14px;color: #b7b7b7; text-align: end; width: 88%; ">
					<span style="color: red;">待续方</span>
					<view style="width: 100%; height: 10px;"></view>
				</view>
				<view class="flx" style="border-top: #f2f2f2 solid 4rpx;">
					<view class="styletext" @click="yyjy(0,{name:'王大陆', age:'32', sex:'男'})">就诊记录</view>
					<view class="styletext" @click="yyjy(1)">电子处方</view>
					<view class="styletext" @click="yyjy(2)">联系患者</view>
				</view>
			</view>

			<view
				style="background-color: #fff;padding-top: 10px; width: 97%; margin:0 auto; border-radius: 30rpx; margin-top:30rpx;">
				<view style="display: flex;">
					<view
						style="margin-left: 15px;margin-top: 15px;margin-bottom: 10px; width: 58px;height: 59px; background-color: #a5a5a5; border-radius: 50%;">
					</view>
					<view style="display: flex;flex-direction: column;justify-content: center; margin-left: 10px;">
						<view style="width: 95%; display: flex;justify-content: space-between;">
							<view class="flx1" style="width:150px;">
								<h4>赵凯</h4>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">女</span>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">|</span>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">32岁</span>
							</view>
							<view style="margin-left: 50px;font-size: 12px; color:#a5a5a5; width: 100px;">
								2022-05-02
							</view>
						</view>

						<view style="margin-top: 10px;">
							<span
								style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px;">四肢无力</span>
							<span
								<!-- style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px; margin-left: 20rpx;">哮喘</span> -->
							<!-- <span style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px;">高血压</span> -->
							<!-- <span style="font-size: 12px;color: #0066ff;">哮喘</span> -->
						</view>
					</view>
				</view>

				<view style="font-size: 14px;color: #b7b7b7; text-align: end; width: 88%; ">
					<span style="color: red;">待续方</span>
					<view style="width: 100%; height: 10px;"></view>
				</view>
				<view class="flx" style="border-top: #f2f2f2 solid 4rpx;">
					<view class="styletext" @click="yyjy(0,{name:'赵凯', age:'32', sex:'女'})">就诊记录</view>
					<view class="styletext" @click="yyjy(1)">电子处方</view>
					<view class="styletext" @click="yyjy(2)">联系患者</view>
				</view>
			</view>
			<view
				style="background-color: #fff;padding-top: 10px; width: 97%; margin:0 auto; border-radius: 30rpx; margin-top:30rpx;">
				<view style="display: flex;">
					<view
						style="margin-left: 15px;margin-top: 15px;margin-bottom: 10px; width: 58px;height: 59px; background-color: #a5a5a5; border-radius: 50%;">
					</view>
					<view style="display: flex;flex-direction: column;justify-content: center; margin-left: 10px;">
						<view style="width: 95%; display: flex;justify-content: space-between;">
							<view class="flx1" style="width:150px;">
								<h4>张三三</h4>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">女</span>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">|</span>
								<span
									style="font-size: 25rpx; color: #a5a5a5; line-height: 45rpx; margin-left: 10rpx;">32岁</span>
							</view>
							<view style="margin-left: 50px;font-size: 12px; color:#a5a5a5; width: 100px;">
								2021-10-10
							</view>
						</view>

						<view style="margin-top: 10px;">
							<span
								style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px;">腿软</span>
							<span
								<!-- style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px; margin-left: 20rpx;">哮喘</span> -->
							<!-- <span style="font-size: 12px; color: #a5a5a5; border: 1rpx solid #a5a5a5; padding: 2rpx; border-radius: 3px;">高血压</span> -->
							<!-- <span style="font-size: 12px;color: #0066ff;">哮喘</span> -->
						</view>
					</view>
				</view>

				<view style="font-size: 14px;color: #b7b7b7; text-align: end; width: 88%; "> 
					<span style="color: red;">待续方</span>
					<view style="width: 100%; height: 10px;"></view>
				</view>
				<view class="flx" style="border-top: #f2f2f2 solid 4rpx;">
					<view class="styletext" @click="yyjy(0,{name:'张三三', age:'32', sex:'女'})">就诊记录</view>
					<view class="styletext" @click="yyjy(1)">电子处方</view>
					<view class="styletext" @click="yyjy(2)">联系患者</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import NavBar from '@/components/NarBar.vue'
	export default {
		components: {
			NavBar
		},
		data() {
			return {
				keyword: '',
				mc: false,
				single: '',
				ISselect: 0,
				customButtonGroup: [{
						text: '重置',
						backgroundColor: '#ff9900',
						color: '#fff'
					},
					{
						text: '完成',
						backgroundColor: '#ff6600',
						color: '#fff'
					}
				],

			}
		},

		methods: {
			handleClickRight() {
				// 在这里处理右侧图标点击事件的逻辑
				this.mc = true
			},
			falseMc() {
				this.mc = false
			},
			goToback() {
				this.mc = false
			},
			maskClick(e) {
				console.log('maskClick事件:', e);
			},
			// gotoagency(){
			// 	uni.navigateTo({ 
			// 		url: '/pages/index/doctor-agency/doctor-agency' ,
			// 		})
			// },
			handlecord() {
				uni.navigateTo({
					url: '/pages/OnlineConsultation/twwzfainfo',
				})
			},
			back() {
				uni.navigateBack({
					delta: 2
				})
			},
			yyjy(e,item) {
				if (e == 0) {
					uni.navigateTo({
						url: '/pages/VisitRecord/VisitRecordInfo?status=' + 1 + '&datas=' + JSON.stringify(item)
					})
				} else if (e == 1) {
					uni.navigateTo({
						url: '/pages/OnlineConsultation/yyjy?status=' + 1
					})
				} else {
					uni.navigateTo({
						url: '/pages/OnlineConsultation/ltzx'
					})
				}
			}


		}
	}
</script>

<style scoped lang="scss">
	.Mc {
		background: rgba(0, 0, 0, 0.3);
		position: absolute;
		z-index: 100;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;

		.example-body {
			background-color: #fff;
			padding: 10px;
		}
	}

	page {
		background-color: #f2f2f2;
	}

	.text {
		font-size: 30rpx;
		color: #333;
		height: 60rpx;
		width: 150rpx;
		line-height: 60rpx;
		text-align: center;
	}

	.selectText {
		width: 150rpx;
		height: 60rpx;
		border-radius: 40rpx;
		font-size: 30rpx;
		background-color: #0099ff;
		color: #fff;
		overflow: hidden;
		box-sizing: border-box;
		text-align: center;
	}

	.styletext {
		text-align: center;
		width: 33%;
		height: 80rpx;
		line-height: 80rpx;
		font-size: 25rpx;
	}

	.shanxuan {
		.shanxuan_ {

			.shanxuan_text {
				font-size: 31rpx;
				letter-spacing: 1rpx;
			}

			.sanjiao {
				width: 0px;
				height: 0px;
				border-top: 8px solid #333;
				border-left: 3px solid transparent;
				border-right: 3px solid transparent;
				border-bottom: 3px solid transparent;
				border-radius: 40rpx;
			}
		}

	}
</style>